<template>
  <Dialog :title="dialogTitle" v-model="dialogVisible">
     <el-form-item label="整合单数量" >
        {{numPrice.num}}
      </el-form-item>
      <el-form-item label="整合单金额" >
        {{numPrice.price}}
      </el-form-item>

    <el-table :data="formData" class="-mt-10px">
      <el-table-column label="序号" type="index" width="100" />
     
      <el-table-column label="发票编号" prop="invoiceNumber" min-width="100" />
      <el-table-column label="发票金额" prop="invoiceValue" min-width="100" />
      <el-table-column label="发票图片" prop="invoiceNo" min-width="150" >
        <template #default="{ row, $index }">
          <el-form-item :prop="`${$index}.fileUrl`"  class="mb-0px!">
            <UploadImg v-model="row.fileUrl" disabled />
          </el-form-item>
        </template>
      </el-table-column>    
      <el-table-column align="center" fixed="right" label="操作" width="150">
   
        <template #default="{row}">
          <el-button
            link
            type="primary"
            @click="handleAdd('update', row.id,list)"
            v-hasPermi="['erp:pur-purchase-order:update']"
          >
            编辑
          </el-button>
          <el-button @click="handleDelete(row.id)" link type="danger"> 删除</el-button>
        </template>
      </el-table-column>
     
    </el-table>
    <el-row justify="center" class="mt-3">
        <el-button @click="handleAdd('create','',list, supplierId)" round>+ 添加发票</el-button>
    </el-row>
    <template #footer>
      <!-- <el-button @click="submitForm" type="primary" :disabled="formLoading">确 定</el-button> -->
      <el-button @click="dialogVisible = false">取 消</el-button>
    </template>
  </Dialog>

    <!-- 表单弹窗：添加/修改 -->
    <PurPurchaseOrderForm ref="formRef" @success="getList"  width = "50%"/>
</template>
<script setup lang="ts">

import { InvoiceApi, InvoiceVO } from '@/api/erp/invoice'
import PurPurchaseOrderForm from './PurPurchaseOrderForm.vue'
import { PurPurchaseOrderVO } from '@/api/erp/purpurchaseorder'

/** ERP 发票 表单 */
defineOptions({ name: 'InvoiceForm' })

const { t } = useI18n() // 国际化
const message = useMessage() // 消息弹窗

const dialogVisible = ref(false) // 弹窗的是否展示
const dialogTitle = ref('') // 弹窗的标题
const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
const formType = ref('') // 表单的类型：create - 新增；update - 修改
const formData = ref([])
const supplierId = ref(0) // 供应商id
const list = ref<PurPurchaseOrderVO[]>([])
const formRef1 = ref() // 表单 Ref
const numPrice = reactive({
  num: 0,
  price: 0
})
const queryParams = reactive({
  pageNo: 1,
  pageSize: 10,
  numbers: []
})

/** 查询列表 */
const getList = async () => {
  try {
    console.log()
    const data = await InvoiceApi.getInvoiceCheckListItemByNumbers(queryParams)
    formData.value = data

  } finally {
  }
}
/** 打开弹窗 */
const open = async (type: string, selectionList?: any) => {
  dialogVisible.value = true
  dialogTitle.value = t('action.' + type)
  formType.value = type
  const numbers = ref([])
  list.value = selectionList.value

  selectionList.value.forEach((item) => {
    numbers.value.push(item.id)
    supplierId.value = item.supplierId
  })
  queryParams.numbers = numbers.value
  console.log(queryParams)
  const data1 = await InvoiceApi.getNumAndPrice(queryParams)
  numPrice.num = data1.orderIntegrateNum
  numPrice.price = data1.orderIntegratePrice

  const data = await InvoiceApi.getInvoiceCheckListItemByNumbers(queryParams)

  formData.value = data
}
defineExpose({ open }) // 提供 open 方法，用于打开弹窗

/** 提交表单 */
const emit = defineEmits(['success']) // 定义 success 事件，用于操作成功后的回调
const submitForm = async () => {
  // 提交请求
  formLoading.value = true
  try {
    const data = formData.value as unknown as InvoiceVO
    console.log(data)
    if (formType.value === 'create') {
      await InvoiceApi.createInvoice(data)
      message.success(t('common.createSuccess'))
    } else {
      await InvoiceApi.updateInvoice(data)
      message.success(t('common.updateSuccess'))
    }
    dialogVisible.value = false
    // 发送操作成功的事件
    emit('success')
  } finally {
    formLoading.value = false
  }
}
/** 添加/修改操作 */
const formRef = ref()
const handleAdd = (type: string,id?:String,list?: any,supplierId?: number) => {
  formRef.value.open(type,id,list,supplierId)
}

// /** 删除按钮操作 */
// const handleDelete = (index) => {
//   formData.value.splice(index, 1)
// }

/** 删除按钮操作 */
const handleDelete = async (id: number) => {
  try {
    // 删除的二次确认
    await message.delConfirm()
    // 发起删除
    await InvoiceApi.deleteInvoice(id)
    message.success(t('common.delSuccess'))
    // 刷新列表
    getList()
  } catch {}
}

</script>